<!DOCTYPE html>
<script src='resources/shadow-dom.js'></script>
<div id='d1'>
  <template data-mode='open'>
    <div id='d1-1'>
      <template data-mode='open'>
        <div id='d1-1-1'>d1-1-1</div>
        <slot name='d1-1-s1'></slot>
        <slot name='d1-1-s2'></slot>
        <div id='d1-1-2'>d1-1-2</div>
      </template>
      <div id='d1-2'>d1-2</div>
      <slot id='d1-s0'></slot>
      <slot name='d1-s1' slot='d1-1-s1'></slot>
      <slot name='d1-s2'></slot>
      <div id='d1-3'>d1-3</div>
      <div id='d1-4' slot='d1-1-s1'>d1-4</div>
    </div>
  </template>
  <div id='d2' slot='d1-s1'>d2</div>
  <div id='d3' slot='d1-s2'>d3</div>
  <div id='d4' slot='non-existent'>d4</div>
  <div id='d5'>d5</div>
</div>
<script>
convertTemplatesToShadowRootsWithin(d1);
</script>
